<template>
	<view>
		<view class="list_box">
			<view class="info_box" v-for="(item,index) in list" :key="index">
				<view class="no_box">
					订单编号:{{item.order_no}}
				</view>
				<view class="goods">
					<image class="img" :src="imgRemote+item.goods_info.simages"></image>
					<view class="ginfo">
						<view class="name">{{item.goods_info.name}}</view>
						<view class="time">兑换时间:{{item.createtime}}</view>
						<view class="num">x{{item.num}}</view>
						<view class="jf">积分:{{item.pay_integral}}</view>
					</view>
				</view>
				<view>
                     <view class="mt">收货人:{{item.site_info.name}}</view>
					 <view class="mt">收货电话:{{item.site_info.mobile}}</view>
					 <view class="mt">收货地址:{{item.site_info.receiving}}{{item.site_info.address}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				imgRemote: getApp().globalData.imgRemote,
				params:{page:1,limit:20},
			    list:[],
				total:''
			}
		},
		onShow() {
		  this.getList();	
		},
		onReachBottom() {
			if (this.list.length < this.total) {
				this.params.page++;
				 this.$get(this.$api.iRecord, this.params,(res)=>{
					 let {data}=res;
					data.data.data.forEach((res) => {
						this.list.push(res);
					});
				});
			}
		},
		methods:{
		    getList(){
				
			    this.$get(this.$api.iRecord, this.params,(res)=>{
			    	let {data}=res;
			    	console.log(data)
			    	if(data.code==1){
			    		
			    		this.list=data.data.data;
			    		this.total=data.data.total;
			    	}
			    })	
			}
		}
	}
</script>

<style lang="scss" scoped>
	.list_box{
		box-sizing: border-box;
		padding: 20rpx;
	}
	.info_box{
		background-color: #fff;
		border-radius: 25rpx;
		box-sizing: border-box;
		padding: 20rpx 30rpx;
		font-size: 28rpx;
	}
	.no_box{
		box-sizing: border-box;
		padding: 0 0 10rpx 0;
		border-bottom: 1rpx solid #e9e9e9;
	}
	.img{
		width: 208rpx;
		height: 208rpx;
		border-radius: 25rpx;
	}
	.goods{
		box-sizing: border-box;
		padding: 20rpx 0;
		display: flex;
		border-bottom: 1rpx solid #e9e9e9;
	}
	.ginfo{
		margin-left: 40rpx;
		width: 55%;
	}
	.name{
		font-weight: bold;
		font-size: 30rpx;
		margin-bottom: 20rpx;
	}
	.time{
		margin-bottom: 20rpx;
	}
	.num{
		text-align: right;
		margin-bottom: 20rpx;
	}
	.jf{
		text-align: right;
		color: red;
	}
	.mt{
		margin-top: 10rpx;
	}
</style>